<template>
	<view style="padding-top: 20upx;" class="fpxq">
		
		<view class="fpdetial bg-fff">
			<view class="">
				<view v-if="lis.inv_title_select == '个人'" class="f-30 title c-333 center">
					个人电子发票
				</view>
				<view v-if="lis.inv_title_select == '单位'" class="f-30 title c-333 center">
					<!-- 增值税电子普通发票 -->
					单位电子发票
				</view>
				<view class="fptext">
					<view v-if="lis.inv_title_select == '单位'" class="">
						<text>公司名称</text>
						<text>{{lis.inv_company}}</text>
					</view>
					<view class="">
						<text>发票金额</text>
						<text>¥{{lis.order_amount}}</text>
					</view>				
				</view>
				<view v-if="lis.inv_title_select == '单位'" class="fptext">		
					<view class="">
						<text>*纳税人识别号</text>
						<text>{{lis.inv_code}}</text>
					</view>
					<view class="hide">
						<text>*注册地址</text>
						<text>{{lis.inv_reg_addr}}</text>
					</view>
					<view class="hide">
						<text>*注册电话</text>
						<text>{{lis.inv_reg_phone}}</text>
					</view>
					<view class="hide">
						<text>*开户银行</text>
						<text>{{lis.inv_reg_bname}}</text>
					</view>
					<view class="hide">
						<text>*银行账户</text>
						<text>{{lis.inv_reg_baccount}}</text>
					</view>
					
					<!-- <view class="">
						<text>*发票内容</text>
						<text>{{lis.inv_rec_name}}</text>
					</view> -->
					<view class="hide">
						<text>*收票人姓名</text>
						<text>{{lis.inv_rec_name}}</text>
					</view>
					<view class="hide">
						<text>*收票人手机号</text>
						<text>{{lis.inv_rec_mobphone}}</text>
					</view>
					<view class="hide">
						<text>发票金额</text>
						<text>{{lis.order_amount}}</text>
					</view>
					<view class="hide">
						<text>单位地址</text>
						<text>{{lis.inv_rec_province}}</text>
					</view>
				</view>
			</view>
			<view class="fpsj">
				<text>开票时间 </text>
				<text style="padding-left: 70upx;">{{lis.add_time | formaDate('yyyy-mm-dd-hh-mm-ss') }}</text>
			</view>
		</view>
		<uni-popup ref="emallbox" type="center">		 
			<view class="emallbox">
				<input @confirm="download()" type="text" v-model="emallValue" placeholder="请输入邮箱" class="Einput" maxlength="30"/>
				<view @click="download()" style="background-color: rgb(249,29,112);margin: 40rpx;color: #FFFFFF;border-radius: 10rpx;text-align: center;line-height: 60rpx;">确认</view>
			</view>		
				
		</uni-popup>
		
		<view @click="download()" style="background-color: rgb(249,29,112);margin: 40rpx;color: #FFFFFF;border-radius: 10rpx;text-align: center;line-height: 60rpx;">下载发票</view>
	</view>
</template>

<script>
	import uniPopup from "@/components/uni-popup/uni-popup.vue"
	export default {
		components: {			
			uniPopup
		},
		data() {
			return {
				emallValue:"",
				lis:{},
				order_sn:""
			}
		},
		onLoad(options) {
			if(options.order_sn){
				this.order_sn=options.order_sn
			}
			this.getStoreData();
			 
		},
		methods: {
			download(){
				var that=this
				if(lis.is_own_shop==1){
					if(that.emallValue == ""){
						this.$refs.emallbox.open()
						return false
					}
				}else{
					uni.showToast({
						title:"请联系客服发放发票",
						icon:"none"
					})
				}
				
			    var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/
				if(reg.test(that.emallValue)){
					this.$util.request({
						url:"/mobile/index.php?act=member_invoice&op=dow_invoice",
						method:'post',
						data: {
							"order_sn":this.order_sn,
							"email":that.emallValue
						},
					}).then((res)=> {
						if(res.error_code == 0){   
							uni.showToast({
								title:"下载成功！",
								icon:"none"
							})
							this.$refs.emallbox.close()
						}else{
							uni.showToast({
								title:res.message,
								icon:"none"
							})
						}
					})	
				}else{
					this.$refs.emallbox.open()	
						uni.showToast({
							title:"邮箱格式错误",
							icon:"none"
						})
						return false
					}
				
			},
			getStoreData(){
				var that=this
				this.$util.request({					
					// url: '/mobile/index.php?act=member_invoice&op=invoice_list',
					url:"/mobile/index.php?act=member_invoice&op=order_invoice_info",
					method: 'get',
					data: {
						"order_sn":this.order_sn
					},
				}).then((res)=> {		
					console.log("发票详情")
					if(res.error_code == 0){
						this.lis=res.datas.invoice_info
					}
				})
			},
		}
	}
</script>

<style>
	.Einput{
		font-size: 30upx;
		border: 1px solid #999999;
		width: 450rpx;
		height: 60rpx;
		margin: 0 auto;
	}
	.fpxq .fpsj{
		margin-top:56upx;
		padding:0 38upx;
	}
	.fpxq .fptext>view:not(:last-child){
		margin-bottom:40upx;
		
	}
	.fpxq .fptext>view>text:first-of-type{
		color:#333;
		font-size:28upx;
		margin-right:70upx;
	}
	.fpxq .fptext>view>text:last-of-type{
		color:#848484;
		font-size:28upx;
	}
	.fpxq .fptext{
		padding:38upx;
		border-bottom:1upx dashed #dcdcdc;
	}
	.fpxq .fpdetial{
		margin:0 20upx;
		border-radius: 20upx;
		box-shadow: 0px 3px 9.8px 0.2px rgba(0, 0, 0, 0.26);
		/* height:832upx; */
		padding-bottom:200upx;
		margin-top:70upx;
	}
	.fpxq .title{
		padding:48upx;
		background:url(@/static/images/w/fp.png) no-repeat center;
		background-size:221upx 83upx;
		border-bottom:1upx dashed #dcdcdc;
	}
	.hide{
		display: none;
	}
	.emallbox{
		box-sizing: border-box;
		padding-top: 80upx;
		background-color: #fff;
		width: 500upx;
		height: 300upx;
		border: #fff;
		border-radius: 15upx;
		text-align: center;
	}
</style>
